<%@ page contentType="text/html;charset=UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<c:set var="ctx" value="${pageContext.request.contextPath}" />
<%@ taglib prefix="fn" uri="http://java.sun.com/jsp/jstl/functions"%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
	<head>
		<title>生成拣货任务</title>

		<script language="javascript" type="text/javascript"
			src="${ctx}/static/datepicker/WdatePicker.js"></script>
		<script type="text/javascript">
	var areaLists = '${areaCode}';
	var type = '${type}';
	var fromDate = '${param.search_fromDate}';
	var endDate = '${param.search_endDate}';
	var customerCode = '${customerCode}';
	var isdelv='${isdelv}';
	var ordenoSourceCode='${ordenoSourceCode}';
	
	
	function setType(item){
	  type=item;
	}

	$(function() {
		$("#inputForm").validate(); //为inputForm注册validate函数
		$("#beginTimeStr").datepicker({
			format : 'yyyy-mm-dd'
		});
		$("#endTimeStr").datepicker({
			format : 'yyyy-mm-dd'
		});

	});
	function query() {
		var beginTimeStr = $("#beginTimeStr").val();
		if (beginTimeStr == "" || beginTimeStr == null) {
			$("#beginTimeStr").focus();
			$("#timeMessage").html("起始时间不能为空");
			$("#timeMessage").show();
			return;
		}
		var endTimeStr = $("#endTimeStr").val();
		if (endTimeStr == "" || endTimeStr == null) {
			$("#endTimeStr").focus();
			$("#timeMessage").html("终止时间不能为空");
			$("#timeMessage").show();
			return;
		}
		$("#inputForm").attr("action", "${ctx}/batchTask/searchNew");
		$("#inputForm").submit();
	}
	
	function myCheckedAllTWS() {
		var tempChecked = "";
		$("input[type='checkbox'][name='"+type+"myChecked']:checked").each(function() {
			   if(tempChecked==""){
		         tempChecked=$(this).val();
		     }else{
		         tempChecked = tempChecked + ":" + $(this).val();
		     }

		});
		return tempChecked;
	}

	function ajaxOrdenosCreateBatchTask() {
	   var ordenos=myCheckedAllTWS();
	   if(""==ordenos){
	     $("#content").html("没有选择订单");
	     return;
	   }
		showBg();
		$.ajax({
			type : 'post',
			url : '${ctx}/batchTask/ajaxOrdenosCreateBatchTask',
			data : 'ordenos=' + ordenos + '&orderType=' + type
					+ '&customerCode=' + customerCode + '&number='
					+ $("#number").val() + '&areaLists='+$("#areaLists").val()+'&isdelv='+isdelv+'&ordenoSourceCode='+ordenoSourceCode,
			dataType : 'json',
			success : function(data) {
				$("#message").show();
				closeBg();
				if (data.status == "1") {
					$("#content").html("共生成拣货批次:" + data.content);
					window.location.href = "${ctx}/batchTask/batchTaskLists";
				} else {
					$("#content").html(data.content);
				}

			},

			error : function() {

			}
		});
	}
	
	
	function myCheckedAll(item){
		$("input[name='"+item+"myChecked']").attr("checked",$("#"+item+"myCheckedAll").is(":checked"));
	}
	
	 function myChecked(item,type) {
		if ($("#"+type+"check" + item).is(":checked")) {
		} else {
			$("#"+type+"myCheckedAll").attr("checked", false);
		}
	}
	
	function ajaxAreaGroup(item) {
		customerCode=item.value;
		$.ajax({
					type : 'post',
					url : '${ctx}/v2/customers/ajaxAreaGroup',
					data : 'customerCode=' + customerCode,
					dataType : 'json',
					success : function(data) {
					  var tempString="";
						if (data.status == "1") {
							$.each(data.content.restAreaGroupDtos,function(i){
							    tempString+="<option value="+data.content.restAreaGroupDtos[i].areaCodes+"--"
							    +data.content.restAreaGroupDtos[i].areagroupCode+"--"+data.content.restAreaGroupDtos[i].areagroupName+">"+data.content.restAreaGroupDtos[i].areagroupName;
							});
						} else {
							alert(data.content);
						}
                        $("#areaLists").html(tempString);
                        $("#areaLists").trigger("chosen:updated");
                        ajaxfindOrdenoSource(item);
                       
					},
					error : function() {
						alert("获取信息错误！");
					}
				});
	}
	
	
	function ajaxfindShopSource(item,type) {
		var value=(type==1? item:item.value);
		$.ajax({
					type : 'post',
					url : '${ctx}/v2/customers/ajaxfindShopSource',
					data : 'ordenoSourceCode=' + value+'&customerCode='+customerCode,
					dataType : 'json',
					success : function(data) {
					    var tempString="<option value=\"-1\">请选择";
						if (data.status == "1") {
							$.each(data.content,function(i){
							    tempString+="<option value="+data.content[i].shopCode+">"+data.content[i].shopName;
							});
						} 
                        $("#shopCodeId").html(tempString);
                        $("#shopCodeId").trigger("chosen:updated");
					},
					error : function() {
						alert("获取信息错误！");
					}
				});
	}
	
	function ajaxfindOrdenoSource(item) {
		customerCode=item.value;
		$.ajax({
					type : 'post',
					url : '${ctx}/v2/customers/ajaxfindOrdenoSource',
					data : 'customerCode=' + customerCode,
					dataType : 'json',
					success : function(data) {
					    var tempString="";
						if (data.status == "1") {
							$.each(data.content,function(i){
							    tempString+="<option value="+data.content[i].ordenoSourceCode+">"+data.content[i].ordenoSourceName;
							});
						} else {
							alert(data.content);
						}
                        $("#ordenoSourceCode").html(tempString);
                        $("#ordenoSourceCode").trigger("chosen:updated");
                        var ordenoSourceCode=$("#ordenoSourceCode").val();
                        ajaxfindShopSource(ordenoSourceCode,1);
					},
					error : function() {
						alert("获取信息错误！");
					}
				});
	}
	
</script>
	</head>
	<body>

		<c:if test="${not empty message }">
			<div id="message" class="alert alert-success">
				<span id="content">订单总数量:${message }</span>
			</div>
		</c:if>
		<div id="fullbg"></div>
		<div id="dialog">
			<div>
				<img src="${ctx }/static/022.gif"></img>
			</div>
		</div>
		<div class="row">
			<form method="post" id="inputForm" class="form-search">
				<div class="span12" style="padding-top: 10px;padding-left: 28px;">
					<div class="span4">
						<label>
							<b>客户名称:</b>
						</label>
						<select name="search_EQ_customerCode" class="input-medium" style="width: 220px;" onchange="ajaxAreaGroup(this)" id="customerId">
							<c:forEach items="${customers}" var="obj">
								<option value="${obj.customerCode}"
									<c:if test="${customerCode eq obj.customerCode}">selected</c:if>>
									${obj.customerName}
								</option>
							</c:forEach>
						</select>
					</div>
					
					<div class="span4" style="padding-left: 10px;">
						<label>
							<b>订单来源平台:</b>
						</label>
						<select name="search_EQ_erpType" class="input-medium" style="width: 220px;" id="ordenoSourceCode" onchange="ajaxfindShopSource(this,2)">
							<c:forEach items="${ordenoSources}" var="obj">
								<option value="${obj.ordenoSourceCode}"
									<c:if test="${ordenoSourceCode eq obj.ordenoSourceCode}">selected</c:if>>
									${obj.ordenoSourceName}
								</option>
							</c:forEach>
						</select>
					</div>
					
					<div class="span4" style="padding-left: 10px;">
						<label>
							<b>店铺名称:</b>
						</label>
						<select name="search_EQ_shopCode" class="input-medium" style="width: 220px;" id="shopCodeId">
						        <option value="-1">
									请选择
								</option>
							<c:forEach items="${shopSources}" var="obj">
								<option value="${obj.shopCode}"
									<c:if test="${param.search_EQ_shopCode eq obj.shopCode}">selected</c:if>>
									${obj.shopName}
								</option>
							</c:forEach>
						</select>
					</div>
					
					
					
					
				</div>
				<div class="span12" style="padding-top: 10px;margin-bottom: 28px;">
				
				   <div class="span4" >
						<label>
							<b>发往网点:</b>
						</label>
						<select name="search_areaLists" class="input-medium" style="width: 220px;" id="areaLists">
							<c:forEach items="${object.restAreaGroupDtos}" var="obj">
								<option value="${obj.areaCodes}--${obj.areagroupCode}--${obj.areagroupName}"
									<c:if test="${provice eq obj.areaCodes}">selected</c:if>>
									${obj.areagroupName}
								</option>
							</c:forEach>
						</select>
					</div>
					<div class="span4">
						<label>
							<b>开始时间:</b>
						</label>
						<input type="text" id="beginTimeStr" name="search_fromDate"
							value="${param.search_fromDate }"
							onFocus="WdatePicker({maxDate:'#F{$dp.$D(\'endTimeStr\')}',startDate:'%y-%M-01 00:00:00',dateFmt:'yyyy-MM-dd HH:mm:ss',alwaysUseStartDate:false,readOnly:true})" />
					</div>
					<div class="span4">
						<label>
							<b>结束时间:</b>
						</label>
						<input type="text" id="endTimeStr" name="search_endDate"
							value="${param.search_endDate }"
							onFocus="WdatePicker({minDate:'#F{$dp.$D(\'beginTimeStr\')}',startDate:'%y-%M-01 00:00:00',dateFmt:'yyyy-MM-dd HH:mm:ss',alwaysUseStartDate:false,readOnly:true})" />

				
						<button type="button" onclick="query();" class="btn">
							查询
						</button>
						<span id="timeMessage" class="alert alert-success"
							style="display: none;"></span>
							 
						
					</div>
				</div>
			</form>
		</div>
		
		
		<div class="tabbable">
			<!-- Only required for left/right tabs -->
			<ul class="nav nav-tabs">
				<li id="singlesId" class="active">
					<a href="#tab1" data-toggle="tab"><span id="fold">单件(${fn:length(singleEdiOrders)})</span>
					</a>
				</li>
				<li id="multiplesId">
					<a href="#tab2" data-toggle="tab"><span id="unfold">多件(${fn:length(multipleEdiOrders)})</span>
					</a>
				</li>
				<li id="multiplesId">
					<a href="#tab3" data-toggle="tab"><span id="unfold">中转发(${fn:length(forwardEdiOrders)})</span>
					</a>
				</li>
			</ul>
			<div class="tab-content">
				<div class="tab-pane active" id="tab1">
						  
							<a href="#selectNumber" data-toggle="modal" role="button"
								class="btn btn-success" onclick="setType('single');">生成分拣批次</a>

					<table id="contentTable"
			class="table table-striped table-bordered table-condensed">
			<thead>
				<tr>
				    <th style="width: 50px;">
									全选:
									<input type="checkbox" name="singlemyCheckedAll"
										id="singlemyCheckedAll" onclick="myCheckedAll('single')" />
					</th>
					<th>
						订单号
					</th>
					<th>
						来源店铺
					</th>
					<th>
						收货人
					</th>
					<th>
						目的地
					</th>
					<th>
						审核时间
					</th>
					<th>
						订单类型
					</th>
					<th>
						查询
					</th>
				</tr>
			</thead>
			<tbody>
				<c:forEach items="${singleEdiOrders}" var="order">
					<tr>
					   <td align="right">
										<input type="checkbox" name="singlemyChecked"
										    id="singleckeck${order.ordeno}"
											value="${order.ordeno}"
											onclick="myChecked('${order.ordeno}','single')" />
						</td>
						<td>
							${order.ordeno}
						</td>
						<td>
							${order.shopna}
						</td>
						<td>
							${order.recena}
						</td>
						<td>
							${order.provna}
						</td>
						<td>
							${order.crtime}
						</td>
						
						<td>
							<c:if test="${order.isdelv eq true}">
							         <span class="label label-success">总仓订单</span>
							</c:if>
							<c:if test="${order.isdelv eq false}">
							       <span class="label label-important">分仓订单</span>
							</c:if>
						</td>
						<td>
							<a href="#ordersDetailed"
								onclick="getAjaxOrders('${order.id}')" role="button"
								class="btn" data-toggle="modal"> 订单详情 </a>

							<a href="#itemsDetailed"
								onclick="getAjaxItems('${order.id}')" role="button"
								class="btn" data-toggle="modal"> 商品详情 </a>
						</td>
					</tr>
				</c:forEach>
			</tbody>
		</table>
					
				</div>
				<div class="tab-pane" id="tab2">
				
					<div class="tab-pane">
						  
							<a href="#selectNumber" data-toggle="modal" role="button"
								class="btn btn-success" onclick="setType('multiple');">生成分拣批次</a>

						<table id="contentTable"
			class="table table-striped table-bordered table-condensed">
			<thead>
				<tr>
				    <th style="width: 50px;">
									全选:
									<input type="checkbox" name="multiplemyCheckedAll"
										id="multiplemyCheckedAll" onclick="myCheckedAll('multiple')" />
					</th>
					<th>
						订单号
					</th>
					<th>
						来源店铺
					</th>
					<th>
						收货人
					</th>
					<th>
						目的地
					</th>
					<th>
						审核时间
					</th>
					<th>
						订单类型
					</th>
					<th>
						查询
					</th>
				</tr>
			</thead>
			<tbody>
				<c:forEach items="${multipleEdiOrders}" var="order">
					<tr>
					   <td align="right">
										<input type="checkbox" name="multiplemyChecked"
										    id="multipleckeck${order.ordeno}"
											value="${order.ordeno}"
											onclick="myChecked('${order.ordeno}','multiple')" />
						</td>
						<td>
							${order.ordeno}
						</td>
						<td>
							${order.shopna}
						</td>
						<td>
							${order.recena}
						</td>
						<td>
							${order.provna}
						</td>
						<td>
							${order.crtime}
						</td>
						
						<td>
							<c:if test="${order.isdelv eq true}">
							         <span class="label label-success">总仓订单</span>
							</c:if>
							<c:if test="${order.isdelv eq false}">
							       <span class="label label-important">分仓订单</span>
							</c:if>
						</td>
						<td>
							<a href="#ordersDetailed"
								onclick="getAjaxOrders('${order.id}')" role="button"
								class="btn" data-toggle="modal"> 订单详情 </a>

							<a href="#itemsDetailed"
								onclick="getAjaxItems('${order.id}')" role="button"
								class="btn" data-toggle="modal"> 商品详情 </a>
						</td>
					</tr>
				</c:forEach>
			</tbody>
		</table>
						
					</div>
				</div>
				<div class="tab-pane" id="tab3">
					<div class="tab-pane">
						   
							<a href="#selectNumber" data-toggle="modal" role="button"
								class="btn btn-success" onclick="setType('forward');">生成分拣批次</a>

						<table id="contentTable"
			class="table table-striped table-bordered table-condensed">
			<thead>
				<tr>
				    <th style="width: 50px;">
									全选:
									<input type="checkbox" name="forwardmyCheckedAll"
										id="forwardmyCheckedAll" onclick="myCheckedAll('forward')" />
					</th>
					<th>
						订单号
					</th>
					<th>
						来源店铺
					</th>
					<th>
						收货人
					</th>
					<th>
						目的地
					</th>
					<th>
						审核时间
					</th>
					<th>
						订单类型
					</th>
					<th>
						查询
					</th>
				</tr>
			</thead>
			<tbody>
				<c:forEach items="${forwardEdiOrders}" var="order">
					<tr>
					   <td align="right">
										<input type="checkbox" name="forwardmyChecked"
										    id="forwardckeck${order.ordeno}"
											value="${order.ordeno}"
											onclick="myChecked('${order.ordeno}','forward')" />
						</td>
						<td>
							${order.ordeno}
						</td>
						<td>
							${order.shopna}
						</td>
						<td>
							${order.recena}
						</td>
						<td>
							${order.provna}
						</td>
						<td>
							${order.crtime}
						</td>
						
						<td>
							<c:if test="${order.isdelv eq true}">
							         <span class="label label-success">总仓订单</span>
							</c:if>
							<c:if test="${order.isdelv eq false}">
							       <span class="label label-important">分仓订单</span>
							</c:if>
						</td>
						<td>
							<a href="#ordersDetailed"
								onclick="getAjaxOrders('${order.id}')" role="button"
								class="btn" data-toggle="modal"> 订单详情 </a>

							<a href="#itemsDetailed"
								onclick="getAjaxItems('${order.id}')" role="button"
								class="btn" data-toggle="modal"> 商品详情 </a>
						</td>
					</tr>
				</c:forEach>
			</tbody>
		</table>
						
					</div>
				</div>
			</div>
		</div>

		
		<div id="selectNumber" class="modal hide fade" tabindex="-1"
			role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
			<div class="modal-header">
				<h3>
					请选择每个分拣批次的订单数
				</h3>
			</div>
			<div class="modal-body">
				<div class="control-group">
					<label for="areaGroup_groupName" class="control-label">
						每个批次
						<select name="number" class="input-medium" id="number">
							<c:forEach items="${taskNumber.batchTaskNumberLists }" var="obj">
								<option value="${obj }">
									${obj }
								</option>
							</c:forEach>
						</select>
						订单
					</label>
				</div>


			</div>
			<div class="modal-footer">
				<button class="btn" data-dismiss="modal" aria-hidden="true" onclick="ajaxOrdenosCreateBatchTask();">
					确定
				</button>
			</div>
		</div>
		<div style="display: none; width: 1000" class="modal hide fade"
			tabindex="-1" role="dialog" aria-labelledby="myModalLabel"
			aria-hidden="true" id="ordersDetailed">
			<div class="modal-header">
				<h3 id="myModalLabel">
					订单详细信息
				</h3>
			</div>
			<div class="modal-body">
				<table class="table table-striped table-bordered table-condensed"
					id="modalBodyOrders"></table>
			</div>
			<div class="modal-footer">
				<button class="btn" data-dismiss="modal" aria-hidden="true">
					关闭
				</button>
			</div>
		</div>

		<div style="display: none; width: 1000" class="modal hide fade"
			tabindex="-1" role="dialog" aria-labelledby="myModalLabel"
			aria-hidden="true" id="itemsDetailed">
			<div class="modal-header">
				<h3 id="myModalLabel">
					商品详细信息
				</h3>
			</div>
			<div class="modal-body">
				<table class="table table-striped table-bordered table-condensed"
					id="modalBodyItems"></table>
			</div>
			<div class="modal-footer">
				<button class="btn" data-dismiss="modal" aria-hidden="true">
					关闭
				</button>
			</div>
		</div>
	</body>
</html>